<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<title>CSS3 3D立方体焦点图动画DEMO演示</title>

<link rel="stylesheet" href="css/reset.min.css">
<link rel="stylesheet" href="css/style.css">


</head>

<body>

<div class="cube-container">

	<div class="cube initial-position">

		<img class="cube-face-image image-1" src="images/p1300.jpg">
		
		<img class="cube-face-image image-2" src="images/p2300.jpg">
		
		<img class="cube-face-image image-3" src="images/p3300.jpg">
		
		<img class="cube-face-image image-4" src="images/p4300.jpg">
		
		<img class="cube-face-image image-5" src="images/p5300.jpg">
		
		<img class="cube-face-image image-6" src="images/p6300.jpg">

	</div>

</div>

<div class="image-buttons">

	<input type="image" class="show-image-1" src="images/p1100.jpg"></input>

	<input type="image" class="show-image-2" src="images/p2100.jpg"></input>

	<input type="image" class="show-image-3" src="images/p3100.jpg"></input>

	<input type="image" class="show-image-4" src="images/p4100.jpg"></input>

	<input type="image" class="show-image-5" src="images/p5100.jpg"></input>

	<input type="image" class="show-image-6" src="images/p6100.jpg"></input>

</div>
  

<script  src="js/index.js"></script>

</body>
</html>
